<style>
.w-e-text-container{z-index: 2!important;}
.w-e-menu{z-index: 3!important;}
.w-e-text{overflow-y: auto;}
a{color: #2E59FF}
#editor {
    width:100%;
}
</style>

<template>
    <section id="editor"  @input="emitContent" ></section>
</template>

<script>
import qs from 'qs'
import editor from 'wangeditor'

var eDemo;      // 编辑器实例

export default{
    props: ['content','disable'],
    data(){
        return {
            emitHtml:''
        }
    },
    mixins: [mixinMethods],
    components: {
        editor
    },

    methods: {
        emitContent(){
            this.$emit('input', this.emitHtml);

        },

        formatContent(content){
            this.emitHtml = content
            this.emitContent()
        },

        createEditor(){
            var self = this;
            eDemo = new editor('#editor');
            eDemo.customConfig.menus = [
                'head',
                'bold',
                'italic',
                'underline',
                'link',
                'unlink',
                'justify',
                // 'image',
                'undo',
                'redo'
            ];


            eDemo.customConfig.onchange = function() {
                self.formatContent(eDemo.txt.html())

                // self.$emit('setEdit', eDemo.txt.html())
            }


            eDemo.customConfig.linkImgCallback = function (url) {
                console.log(url) // url 即插入图片的地址
            }
            eDemo.customConfig.uploadImgServer = '/upload';

            eDemo.create();
            if(this.disable){
                eDemo.disable();
            }

	        /* 配置OSS参数，传到editor里 */
	        axios.post('/api/system/getOssConfig', qs.stringify({
		        platSign: 'admin'
	        })).then(function(r){
		        var d = r.data;
		        if(d.flag == 1){
			        eDemo.OSSInfo = d.data;
		        }
	        })

        }
    },
    watch: {
        'content': function(){
            eDemo.txt.html(this.content);
        }
    },
    beforeCreate(){

    },
    mounted(){
        setTimeout(()=>{
            this.createEditor();
            eDemo.txt.html(this.content);
        })
    }
}


</script>
